<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    function fn() {
        setTimeout(function () {
            //创建随机方块
            var square = document.createElement("div")
            square.style.width = 15 + 'px'
            square.style.height = 15 + 'px'
            square.style.backgroundColor = "red"
            square.style.position = "absolute"
            square.style.left = Math.round(Math.random() * document.documentElement.clientWidth) + 'px'
            square.style.top = Math.round(Math.random() * document.documentElement.clientHeight) + 'px'
            var arr = ['red', 'skyblue', 'gold', 'blue']
            square.style.backgroundColor = arr[Math.round(Math.random() * 3)]
            document.body.append(square)
            //点击方块消失
            square.onmousedown = function () {
                this.style.display = "none"
            }
            //退出
            document.onkeypress = function (e) {
                // var res=keyCode = e.keyCode
                if (e.keyCode == 122) {
                    var res = confirm('要离开我吗?')
                    console.log(res)
                    if (res) {
                        window.close()
                    }
                }
            }
            fn()

        }, 100)

    }
    fn()


</script>

</html>